// 魔法学院管理系统 - REF响应式API实践
// 由于我们已经在sd目录下设置了package.json和Vue环境，这里的导入是正确的
import { ref } from 'vue'


// ==================== 1. 学生信息管理 ====================
// 创建学生相关的响应式数据
const studentName = ref<string>('')
const studentLevel = ref<number>(1)
const isEnrolled = ref<boolean>(false)

/**
 * 注册学生
 * @param name 学生姓名
 */
const enrollStudent = (name: string): void => {
  studentName.value = name
  isEnrolled.value = true
  studentLevel.value = 1 // 新学生从1级开始
  console.log(`${name}已成功注册为魔法学院学生！`)
}

/**
 * 提升学生等级
 */
const levelUp = (): void => {
  if (!isEnrolled.value) {
    console.log('学生未注册，无法提升等级！')
    return
  }
  
  if (studentLevel.value < 10) {
    studentLevel.value++
    console.log(`${studentName.value}升级了！当前等级：${studentLevel.value}`)
  } else {
    console.log(`${studentName.value}已经达到最高等级了！`)
  }
}

/**
 * 毕业学生
 */
const graduate = (): void => {
  if (isEnrolled.value) {
    console.log(`${studentName.value}已从魔法学院毕业，毕业等级：${studentLevel.value}`)
    isEnrolled.value = false
  } else {
    console.log('没有注册的学生需要毕业！')
  }
}

// ==================== 2. 魔法能量监控 ====================
// 创建魔法能量相关的响应式数据
const magicEnergy = ref<number>(100)
const isCritical = ref<boolean>(false)
const energyStatus = ref<string>('充足')

/**
 * 消耗魔法能量
 * @param amount 消耗的能量值
 */
const consumeEnergy = (amount: number): void => {
  if (amount < 0) {
    console.log('消耗值不能为负数！')
    return
  }
  
  magicEnergy.value = Math.max(0, magicEnergy.value - amount)
  updateEnergyStatus()
  console.log(`消耗了${amount}点魔法能量，剩余：${magicEnergy.value}`)
}

/**
 * 补充魔法能量
 * @param amount 补充的能量值
 */
const rechargeEnergy = (amount: number): void => {
  if (amount < 0) {
    console.log('补充值不能为负数！')
    return
  }
  
  magicEnergy.value = Math.min(100, magicEnergy.value + amount)
  updateEnergyStatus()
  console.log(`补充了${amount}点魔法能量，当前：${magicEnergy.value}`)
}

/**
 * 更新能量状态描述和临界状态
 */
const updateEnergyStatus = (): void => {
  // 更新临界状态
  isCritical.value = magicEnergy.value < 20
  
  // 更新能量状态描述
  if (magicEnergy.value >= 80) {
    energyStatus.value = '充足'
  } else if (magicEnergy.value >= 50) {
    energyStatus.value = '良好'
  } else if (magicEnergy.value >= 20) {
    energyStatus.value = '一般'
  } else if (magicEnergy.value > 0) {
    energyStatus.value = '不足'
  } else {
    energyStatus.value = '枯竭'
  }
}

/**
 * 检查并返回能量状态
 */
const checkEnergyStatus = (): string => {
  updateEnergyStatus()
  return energyStatus.value
}

// ==================== 3. 学院通知系统 ====================
// 创建通知相关的响应式数据
type NotificationType = 'info' | 'success' | 'warning' | 'error'

const notification = ref<string>('')
const showNotification = ref<boolean>(false)
const notificationType = ref<NotificationType>('info')

/**
 * 发送通知
 * @param message 通知内容
 * @param type 通知类型
 */
const sendNotification = (message: string, type: NotificationType = 'info'): void => {
  notification.value = message
  notificationType.value = type
  showNotification.value = true
  console.log(`[${type.toUpperCase()}] ${message}`)
  
  // 3秒后自动关闭通知
  setTimeout(() => {
    if (showNotification.value) {
      dismissNotification()
    }
  }, 3000)
}

/**
 * 关闭通知
 */
const dismissNotification = (): void => {
  showNotification.value = false
  console.log('通知已关闭')
}

/**
 * 定时发送提醒
 * @param message 提醒内容
 * @param delay 延迟时间（毫秒）
 */
const scheduleReminder = (message: string, delay: number): void => {
  console.log(`将在${delay/1000}秒后发送提醒`)
  setTimeout(() => {
    sendNotification(message, 'warning')
  }, delay)
}

// ==================== 4. 魔法学习统计 ====================
// 创建学习统计相关的响应式数据
const spellCount = ref<number>(0)
const practiceHours = ref<number>(0)
const isPracticeMode = ref<boolean>(false)

/**
 * 学习新咒语
 */
const learnNewSpell = (): void => {
  spellCount.value++
  console.log(`学习了新咒语！已掌握${spellCount.value}个咒语`)
  
  // 如果正在练习模式，同时增加练习时间
  if (isPracticeMode.value) {
    addPracticeTime(0.5) // 学习一个新咒语增加0.5小时练习时间
  }
}

/**
 * 增加练习时间
 * @param hours 练习小时数
 */
const addPracticeTime = (hours: number): void => {
  if (hours < 0) {
    console.log('练习时间不能为负数！')
    return
  }
  
  practiceHours.value += hours
  console.log(`增加了${hours}小时练习时间，总练习时间：${practiceHours.value}小时`)
}

/**
 * 切换练习模式
 */
const togglePracticeMode = (): void => {
  isPracticeMode.value = !isPracticeMode.value
  const mode = isPracticeMode.value ? '开启' : '关闭'
  console.log(`练习模式已${mode}`)
}

// ==================== 测试代码 ====================
/**
 * 运行所有功能测试
 */
const runTests = (): void => {
  console.log('=== 开始测试魔法学院管理系统 ===\n')
  
  // 测试学生管理
  console.log('\n--- 测试学生管理功能 ---')
  enrollStudent('赫敏·格兰杰')
  levelUp()
  levelUp()
  console.log(`学生信息 - 姓名: ${studentName.value}, 等级: ${studentLevel.value}, 已注册: ${isEnrolled.value}`)
  
  // 测试魔法能量
  console.log('\n--- 测试魔法能量功能 ---')
  consumeEnergy(30)
  rechargeEnergy(15)
  console.log(`能量状态 - 当前值: ${magicEnergy.value}, 状态: ${energyStatus.value}, 临界状态: ${isCritical.value}`)
  
  // 测试通知系统
  console.log('\n--- 测试通知系统功能 ---')
  sendNotification('明天将举行魔法比赛！', 'success')
  console.log(`通知信息 - 内容: ${notification.value}, 显示: ${showNotification.value}, 类型: ${notificationType.value}`)
  
  // 测试学习统计
  console.log('\n--- 测试学习统计功能 ---')
  togglePracticeMode()
  learnNewSpell()
  addPracticeTime(2.5)
  console.log(`学习统计 - 咒语数量: ${spellCount.value}, 练习时间: ${practiceHours.value}小时, 练习模式: ${isPracticeMode.value}`)
  
  console.log('\n=== 测试完成 ===')
}

// 导出所有变量和函数，以便在组件中使用
export {
  // 学生管理
  studentName,
  studentLevel,
  isEnrolled,
  enrollStudent,
  levelUp,
  graduate,
  
  // 魔法能量
  magicEnergy,
  isCritical,
  energyStatus,
  consumeEnergy,
  rechargeEnergy,
  checkEnergyStatus,
  
  // 通知系统
  notification,
  showNotification,
  notificationType,
  sendNotification,
  dismissNotification,
  scheduleReminder,
  
  // 学习统计
  spellCount,
  practiceHours,
  isPracticeMode,
  learnNewSpell,
  addPracticeTime,
  togglePracticeMode,
  
  // 测试函数
  runTests
}

// 在组件中的使用示例
/*
<template>
  <div class="magic-academy">
    <h1>魔法学院管理系统</h1>
    
    <!-- 学生信息 -->
    <div class="section">
      <h2>学生管理</h2>
      <p v-if="!isEnrolled">请先注册学生</p>
      <div v-else>
        <p>学生：{{ studentName }}</p>
        <p>等级：{{ studentLevel }}</p>
        <button @click="levelUp">升级</button>
        <button @click="graduate">毕业</button>
      </div>
      <div>
        <input v-model="newStudentName" placeholder="输入学生姓名" />
        <button @click="enrollStudent(newStudentName)">注册</button>
      </div>
    </div>
    
    <!-- 魔法能量 -->
    <div class="section">
      <h2>魔法能量监控</h2>
      <div class="energy-bar" :class="{ 'critical': isCritical }">
        <div class="energy-fill" :style="{ width: magicEnergy + '%' }"></div>
      </div>
      <p>当前能量：{{ magicEnergy }} ({{ energyStatus }})</p>
      <button @click="consumeEnergy(10)">消耗能量</button>
      <button @click="rechargeEnergy(20)">补充能量</button>
    </div>
    
    <!-- 通知系统 -->
    <div v-if="showNotification" class="notification" :class="notificationType">
      {{ notification }}
      <button @click="dismissNotification">关闭</button>
    </div>
    
    <!-- 学习统计 -->
    <div class="section">
      <h2>学习统计</h2>
      <p>已学咒语：{{ spellCount }}</p>
      <p>练习时间：{{ practiceHours }}小时</p>
      <label>
        <input type="checkbox" v-model="isPracticeMode" />
        练习模式
      </label>
      <button @click="learnNewSpell">学习咒语</button>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { 
  studentName, studentLevel, isEnrolled, enrollStudent, levelUp, graduate,
  magicEnergy, isCritical, energyStatus, consumeEnergy, rechargeEnergy,
  notification, showNotification, notificationType, sendNotification, dismissNotification,
  spellCount, practiceHours, isPracticeMode, learnNewSpell
} from './参考解答'

// 本地变量
const newStudentName = ref('')
</script>
*/